
<template>
  <div class="schedules-form" v-loading="loading">
    <el-form ref="addform" :rules="rules" :model="addForm" label-width="100px" size="mini">
    <el-form-item label="文件" prop="file">
        <el-upload
            ref="upload"
            :multiple="false"
            action="1234"
            accept="*.zip"
            :limit="1"
            :on-exceed="moreThanOne"
            :before-upload="uploadform"
            :on-change="onChange"
            :on-remove="handleRemove"
            :file-list="fileList"
            :auto-upload="false">
            <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
            <div slot="tip" class="el-upload__tip">只能上传zip文件</div>
        </el-upload>
    </el-form-item>

    <el-form-item label="数据日期" prop="dataDate">
        <el-date-picker
            v-model="addForm.dataDate"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择数据日期">
            </el-date-picker>
      </el-form-item>

     <el-form-item label="是否上传附件" prop="enableFile">
        <el-radio v-model="addForm.enableFile" :label="1">是</el-radio>
        <el-radio v-model="addForm.enableFile" :label="0">否</el-radio>
      </el-form-item>

      <el-form-item size="large">
        <el-button type="primary" @click="addFun">保存</el-button>
        <el-button @click="cancelFun">取消</el-button>
      </el-form-item>
    </el-form>
  </div>

</template>
<script>
import {
  mapGetters
} from 'vuex'
import axios from 'axios'
export default {
  name: "newsAdd",
  data() {
    return {
      loading:false,
      addForm: {
          dataDate:'',
          file:'',
          enableFile: 0
        },
        rules:{
          file: [
            { required: true, message: '文件不能为空', trigger: 'blur' }
          ],
          dataDate: [
            { required: true, message: '排序不能为空', trigger: 'blur' }
          ]
        },
        fileList: [],
    };
  },
  props: [],
  computed: {
    ...mapGetters({
      userInfo:'getUserInfo'
    })
  },
  watch:{

  },
  methods: {
    moreThanOne() {
      this.$message.error("只能上传一个文件，请先删除旧的再选择新的文件");
    },
    uploadform(file) {
      let Xls = file.name.split(".");
      if (Xls[Xls.length-1] === "zip" ) {
        this.uploadFile(file);
        return false;
      } else {
        this.$message.error("上传文件只能是zip 格式!");
        return false;
      }
    },
    uploadFile(file) {
      this.loading = true;
      const formData = new FormData();
      formData.append("file", file);
      formData.append("dataDate", this.addForm.dataDate);
      formData.append("enableFile", this.addForm.enableFile);
      let config = {
        headers: {
          "Content-Type": "multipart/form-data",
          token: this.userInfo.token
        },
        timeout: 120000000
      };
      let url = "/station/api/shangbao/addFile";
      axios
        .post(url, formData, config)
        .then(data => {
          if (data.data.status === "SUCCESS") {
                this.$message({
                    showClose: true,
                    message: '文件上传成功',
                    type: 'success'
                })
                this.$emit('hascreated');
          } else {
            this.$message({
              showClose: true,
              message: data.data.errorMsg ? data.data.errorMsg : "上传失败",
              type: "error",
              duration: 4000
            });
          }
          this.loading = false;
        })
        .catch(res => {
          // eslint-disable-next-line no-console
          console.log(res);
          this.$message.error("上传失败");
          this.loading = false;
        });
    },

    onChange(file, fileList) {
      if (fileList && fileList.length > 0) {
        let addFile = fileList[0];
        let strs = addFile.name.split(".");
        if (strs[strs.length-1] === "zip" ) {
            this.addForm.file = addFile;
        } else {
          this.$message.error("上传文件只能是zip 格式!");
          return false;
        }
      } else {
        this.addForm.file = "";
      }
    },
    handleRemove(file, fileList) {
      this.addForm.file = "";
    },

    addFun(){
      this.$refs['addform'].validate((valid) => {
       if (valid) {
            if(!this.addForm.dataDate){
                this.$message.error("请选择上传日期");
                return
            }
            this.$refs['addform'].validate(valid => {
                if (valid) {
                //alert('submit!');
                this.$refs.upload.submit();
                } else {
                return false;
                }
            });
       } else {
         return false;
       }
     });
    },
    cancelFun(){
      this.$emit('cancelAdd');
    }
  },
  mounted(){
    //this.addForm.endDate=this.date
    if(this.type==='edit'){
      this.addForm=Object.assign({}, this.modules);   
    }

  }
};
</script>
<style scoped lang="scss">
  .schedules-form{
    position: relative;
  }
</style>
